<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<!-- head 头部-->
<head th:replace="admin/layout/include::head('账号授权管理','')"></head>

<body>
<!-- loading 动画-->
<div th:replace="admin/layout/include::loading"></div>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-form toolbar">
                <div class="pull-left layui-form-pane search-box">
                </div>
            </div>

            <table class="layui-table" id="userAuth-table" lay-filter="userAuth-table">


            </table>
        </div>
    </div>
</div>

<!-- 表格操作列 -->
<shiro:hasPermission name="user:edit">
    <script type="text/html" id="user-table-bar">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" ajax-event="del" ajax-url="/admin/user/" value="{{d.id}}">删除</a>
    </script>
</shiro:hasPermission>
<!-- 表格状态列 -->
<script type="text/html" id="userAuth-tpl-state">
    <input type="checkbox" lay-filter="updateState" ajax-url="/admin/userAuth/updateState/" value="{{d.id}}" lay-skin="switch" lay-text="正常|禁用"
           {{d.state==0?'checked':''}}/>
</script>
<script type="text/html" id="userAuthForm">
    <!-- user表单弹窗 -->
    <form id="userAuth-form" lay-filter="userAuth-form" class="layui-form model-form">
        <input name="authId" type="hidden"/>
        <input name="userId" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label required">账号类型</label>
            <div class="layui-input-block">
                <select name="authType" lay-verType="tips" lay-verify="required" required>
                    <option value="">请选择账号类型</option>
                    <option value="ACCOUNT">ACCOUNT</option>
                    <option value="EMAIL">EMAIL</option>
                    <option value="PHONE">PHONE</option>
                </select>
            </div>
        </div>
<!--        <div class="layui-form-item">-->
<!--            <label class="layui-form-label">账  号:</label>-->
<!--            <div class="layui-input-block">-->
<!--                <input name="userName" placeholder="请输入账号" type="text" class="layui-input" maxlength="20"-->
<!--                       lay-verify="required" required/>-->
<!--            </div>-->
<!--        </div>-->
        <div class="layui-form-item">
            <label class="layui-form-label required" lay-tips="非加密后的密码" lay-direction="2">密  码
                <span class="icon-text"><i class="layui-icon layui-icon-tips"></i></span>
            </label>
            <div class="layui-input-block">
                <input name="authPwd" placeholder="请输入密码" type="text" class="layui-input" maxlength="20"
                       lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closePageDialog">取消</button>
            <button class="layui-btn" lay-filter="userAuth-form-submit" lay-submit>保存</button>
        </div>
    </form>
</script>
<script type="text/html" id="toolbarOepration">
    <div class="layui-btn-group">
        <button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add" ><i
                class="layui-icon">&#xe654;</i>添加</button>
        <button class="layui-btn layui-btn-sm" lay-event="edit">
            <i class="layui-icon layui-icon-edit"></i>编辑</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" ajax-event="batchDel" ajax-url="/admin/userAuth/">
            <i class="layui-icon layui-icon-delete"></i>批量删除</button>
        <button class="layui-btn layui-btn-sm layui-btn-warm" lay-tips="默认密码为A123456" lay-event="restPwd">
            <i class="layui-icon layui-icon-refresh"></i>重置密码</button>

    </div>
</script>
<!-- js部分 -->
<div th:replace="admin/layout/include::js"></div>
<script>
    layui.use(['form', 'table', 'util', 'admin', 'element'], function () {
        var form = layui.form;
        var table = layui.table;
        var layer = layui.layer;
        var util = layui.util;
        var admin = layui.admin;
        var element = layui.element;

        form.render('select');

        const mData = admin.getLayerData();
        // 渲染表格=
       const insTb = table.render({
            elem: '#userAuth-table',
            url: '/admin/userAuth/?userId='+mData.userId,
            page: true,
            loading: true,
            toolbar:'#toolbarOepration',
            height: 'full-60',
            limit: 10,
            limits: [10, 20, 50, 100],
            response: {
                countName: 'total'
            },
            cols: [
                [
                {type: 'checkbox'},
                {field: 'authId', title: '授权ID'},
                {field: 'authPwd',  title: '授权密码'},
                {field: 'authType', title: '授权类型'},
                {field: 'accessToken', title: 'Token'},
                {
                    sort: true, templet: function (d) {
                        return util.toDateString(d.createTime);
                    }, title: '创建时间'
                },
                {field: 'state',minwidth: 100, templet: '#userAuth-tpl-state', title: '状态'}
               /* {align: 'center',fixed:'right',minWidth:200, toolbar: '#user-table-bar', title: '操作'}*/
            ]
            ]
        });

        //头工具栏事件
        table.on('toolbar(userAuth-table)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            if(obj.event==='add'){
                showEditForm(obj.data)
            }else if (obj.event === 'edit') {
                B.error("暂不支持编辑，如果密码错误，请重置密码");
                /*if (checkStatus.data.length === 1) {
                    showEditForm(checkStatus.data[0]);
                } else {
                    B.error("请选择一条记录");
                    return;
                }*/
            }else if (obj.event === 'restPwd') {
                restPwd(mData.userId);
               /*if (checkStatus.data.length === 0) {
                    B.error("请至少选择一条记录");
                    return;
                } else {

                }*/
            };
        });

        function restPwd(userId) {
            layer.confirm('确定重置密码吗，重置只会针对授权类型为ACCOUNT的账号？', {icon: 3, title: '提示信息',skin:'layui-layer-admin'}, function (index) {
                B.post1('/admin/userAuth/restPwd',{userId,userId},function (res) {
                    if (res.success) {
                        B.info(res.msg);
                        insTb.reload({}, 'data');
                    }else{
                        B.error(res.msg);
                    }
                })
                layer.close(index);
            })
        }
        function showEditForm(uadata){
            admin.open({
                type: 1,
                title: '添加账号授权',
                area: '400px',
                content: $('#userAuthForm').html(),
                success: function (layero, dIndex) {
                    $(layero).children('.layui-layer-content').css('overflow', 'visible');
                    form.val('userAuth-form', uadata);
                    form.val('userAuth-form', {"userId":mData.userId});
                    form.render();
                    form.on('submit(userAuth-form-submit)', function (data) {
                        layer.load(2);
                        B.post1('/admin/userAuth/',data.field,function (res) {
                            layer.closeAll('loading');
                            if (res.success) {
                                layer.close(dIndex);
                                B.info(res.msg);
                                insTb.reload({}, 'data');
                            }else{
                                B.error(res.msg);
                            }
                        })
                        return false;
                    });
                }
            });
        }
        // 工具条点击事件
        table.on('tool(userAuth-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;

            if (layEvent === 'edit') { // 修改
                showEditModel(data);
            }else if (layEvent === 'reset') { // 重置密码
                layer.confirm('确定重置此用户的密码吗？', function (i) {
                    layer.close(i);
                    B.post({
                        url: "/admin/user/restPwd",
                        loading: true,
                        data: {userId: obj.data.id},
                        success: function (data) {
                            if (data.success) {
                                layer.msg(data.msg, {icon: 1});
                            } else {
                                layer.msg(data.msg, {icon: 2});
                            }
                        }
                    });
                });
            }
        });


    });
</script>

</body>